<template>
    <div class="lvka">
         <!-- 头部搜索 -->
        <search-header></search-header>
         <!-- 合计 -->
        <div class="total">
            <div class="tol">
                <span class="all">合计：<span class="peo">100人</span></span>
            </div>
            <div class="area">
                <span>地区
                    <img src="static/icon_pc/icon/icon_down.png" alt="">
                </span>
            </div>
        </div>
        <!-- 职场绿卡 -->
        <div class="green">
            <div class="people">
                <img src="static/icon_pc/icon/avatar_boy.png" alt="">
                <h3>第七感HR</h3>
            </div>
            <!-- 文字 -->
            <div class="font">
                <p> 恭喜您在职场官全国职场征信系统中完成查询
                    工作，成功确认您的职场征信等级：<span class="youxiu">优秀</span>！
                </p>
                <p> 我们相信：您是一个 
                    <span class="advantage">稳重、克己奉公、正直、真诚、雄才大略、勤奋、刻苦、踏实、勤恳、杰出、英姿飒爽、超伦、自谦、德高</span>  
                    的职场精英。特颁此证，以资鼓励！</p>
            </div>
            <!-- 二维码 -->
            <div class="ewm">
                <img src="static/icon_pc/icon_login/bottom_code.png" alt="">
            </div>

            <!-- 署名 -->
            <div class="name">
                <h6>职场官</h6>
                <h6>2018.05.30</h6>
            </div>
        </div>
        <h4>长按保存图片</h4>
    </div>
</template>
<script>
    // 引入搜索头部组件
import SearchHeader from '../../common/Searchheader';
export default {
    data() {
        return {
            value:''
        }
    },
    name:'searchlist',
    components: {
        SearchHeader
    }
}
</script>
<style>
.lvka {
    background-color: #fff;
}



/* 职场绿卡 */
.lvka .green {
    width: 6.85rem;
    height: 9.55rem;
    background: url('../../../static/icon_pc/icon/pic_certificate.png');
    background-size: 6.85rem 9.55rem;
    margin: .43rem .32rem .47rem .33rem;
    position: relative;
}
.lvka .people {
    text-align: center;
    padding-top: 33%;
}
.lvka .people img {
    width: 1.2rem;
    height: 1.2rem;
}
.lvka .people h3 {
font-size:.3rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(1,1,1,1);
line-height:.4rem;
}

/* 文字 */
.lvka .font {
    width: 5.72rem;
    height: 2.37rem;
    margin: 0 auto;
    margin-top: .8rem;
}
.lvka .font p {
    font-size: .26rem;
    color: #666;
    text-indent: 2em;
}
.lvka .youxiu {
    color: #F40A0A;
    font-size: .3rem;
    font-weight: 500;
}
.lvka .advantage {
    color: #0085F0;
    font-size: .26rem;
}
/* 二维码 */
.lvka .ewm {
    position: absolute;
    bottom: .5rem;
    left: .46rem;
}
.lvka .ewm img {
    width: 1.3rem;
    height: 1.3rem;

}

/* 署名 */
.lvka .name {
    position: absolute;
    bottom: .5rem;
    right: .63rem;
    text-align: right;
}
/* 长按保存图片 */
h4 {
    font-size: .26rem;
    color: #999;
    text-align: center;
    margin-bottom: .57rem;
}
</style>
